<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>

  <body>
    <p>基本表格</p>
    <hr />
    <table
      border="3px"
      bordercolor="blue"
      width="50%"
      height="100px"
      align="center"
    >
      <tr>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </table>

    <p>网格表格</p>
    <hr />
    <table border="1" bordercolor="blue" width="400" align="center">
      <tr height="100">
        <td colspan="3" align="center">网站名称</td>
      </tr>
      <tr height="50">
        <td width="100">网站标题</td>
        <td colspan="2" align="right">搜索框</td>
      </tr>
      <tr height="100">
        <td>左边</td>
        <td>中间</td>
        <td>右边</td>
      </tr>
      <tr height="100">
        <td colspan="3" align="center">网站底部</td>
      </tr>
    </table>

    <!-- <div>综合表格</div> p标签前后都有一个空格 div只有后面有一个空格-->
    <p>综合表格</p>
    <hr />
    <table
      border="5"
      bordercolor="pink"
      cellspacing="0"
      width="400"
      align="center"
    >
      <tr height="20">
        <td rowspan="8" width="100"><img src="img1/2(1).png" alt="图片" /></td>
        <td rowspan="4" align="center">11</td>
        <td rowspan="2">12</td>
        <td>13</td>
      </tr>
      <tr height="20">
        <td>13</td>
      </tr>
      <tr height="20">
        <td rowspan="2">12</td>
        <td>13</td>
      </tr>
      <tr height="20">
        <td>13</td>
      </tr>
      <tr height="20">
        <td rowspan="4" align="center">11</td>
        <td rowspan="2">12</td>
        <td>13</td>
      </tr>
      <tr height="20">
        <td>13</td>
      </tr>
      <tr height="20">
        <td rowspan="2">12</td>
        <td>13</td>
      </tr>
      <tr height="20">
        <td>13</td>
      </tr>
    </table>
  </body>
</html>
